<template>
    <div class="app-container">
        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
            <el-form-item label="名称" prop="name">
                <el-input v-model="queryParams.name" placeholder="请输入名称" clearable @keyup.enter.native="handleQuery"/>
            </el-form-item>
            <el-form-item label="状态" prop="status">
                <el-select v-model="queryParams.status" placeholder="请选择状态" clearable>
                    <el-option v-for="dict in dict.type.sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value"/>
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            </el-form-item>
        </el-form>
        <TableCard>
            <el-row :gutter="10" class="mb8">
                <el-col :span="1.5">
                    <el-button type="info" plain icon="el-icon-sort" size="mini" @click="toggleExpandAll">展开/折叠</el-button>
                </el-col>
                <el-col :span="10" style="padding-top: 2px; color: #606266;">
                    <span v-if="type=='role'">授权角色：{{objectName}}</span>
                    <span v-if="type=='user'">授权用户：{{objectName}}</span>
                </el-col>
                <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
            </el-row>
            <el-row class="mb8">
                <AuthDes></AuthDes>
            </el-row>
            <el-table v-if="refreshTable" v-loading="loading" :data="amFolderList" row-key="folderId" :default-expand-all="isExpandAll" :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
                <el-table-column label="文件夹名称" align="left" prop="name" width="350" :show-overflow-tooltip="true"/>
                <el-table-column label="路径" align="left" prop="npath" :show-overflow-tooltip="true"/>
                <el-table-column label="状态" align="center" prop="status" width="120">
                    <template slot-scope="scope">
                        <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
                    </template>
                </el-table-column>
                <el-table-column label="影响范围" align="center" prop="range" width="250">
                    <template slot-scope="scope">
                        <el-select v-model="scope.row.range" placeholder="请选择影响范围" clearable>
                            <el-option key="range0" label="仅自己" value="0"/>
                            <el-option key="range1" label="自己以及下级的所有文件夹" value="1"/>
                        </el-select>
                    </template>
                </el-table-column>
                <el-table-column label="查看权限（文件夹）" align="center" prop="authView" width="180">
                    <template slot-scope="scope">
                        <el-switch v-model="scope.row.authView" active-value="1" inactive-value="0" @change="changeOperateAuth(scope.row)"></el-switch>
                    </template>
                </el-table-column>
                <el-table-column label="新增权限（文件夹）" align="center" prop="authAdd" width="180">
                    <template slot-scope="scope">
                        <el-switch v-model="scope.row.authAdd" active-value="1" inactive-value="0" @change="changeOperateAuth(scope.row)"></el-switch>
                    </template>
                </el-table-column>
                <el-table-column label="修改权限（文件夹+档案）" align="center" prop="authUpdate" width="180">
                    <template slot-scope="scope">
                        <el-switch v-model="scope.row.authUpdate" active-value="1" inactive-value="0" @change="changeOperateAuth(scope.row)"></el-switch>
                    </template>
                </el-table-column>
                <el-table-column label="查看档案（档案）" align="center" prop="authViewFileInFolder" width="180">
                    <template slot-scope="scope">
                        <el-switch v-model="scope.row.authViewFileInFolder" active-value="1" inactive-value="0" @change="changeOperateAuth(scope.row)"></el-switch>
                    </template>
                </el-table-column>
                <el-table-column label="删除权限（文件夹+档案）" align="center" prop="authDelete" width="180">
                    <template slot-scope="scope">
                        <el-switch v-model="scope.row.authDelete" active-value="1" inactive-value="0" @change="changeOperateAuth(scope.row)"></el-switch>
                    </template>
                </el-table-column>
            </el-table>
        </TableCard>
    </div>
</template>

<script>
import {getRole} from "@/api/system/role";
import {getUser} from "@/api/system/user";
import {allotRoleFolder, listAuthRoleFolder} from "@/api/am/authRole"
import {allotUserFolder, listAuthUserFolder} from "@/api/am/authUser"
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import AuthDes from "@/views/am/amAuth/authDes"
export default {
    name: "AllotFolder",
    dicts: ['sys_normal_disable'],
    components: {
        AuthDes
    },
    data() {
        return {
            // 遮罩层
            loading: true,
            // 显示搜索条件
            showSearch: true,
            // 文件夹表格数据
            amFolderList: [],
            // 文件夹树选项
            amFolderOptions: [],
            // 弹出层标题
            title: "",
            // 是否显示弹出层
            open: false,
            // 是否展开，默认全部展开
            isExpandAll: true,
            // 重新渲染表格状态
            refreshTable: true,
            // 查询参数
            queryParams: {
                parentId: null,
                name: null,
                status: "0",
                userId: null,
                deptId: null,
            },
            // 表单参数
            form: {},
            // 表单校验
            rules: {},
            // 授权对象名称
            objectName:"",
            // 授权对象id
            id:undefined,
            // 授权类型
            type:""
        };
    },
    created() {
        //角色ID或者是用户id
        const id = this.$route.params && this.$route.params.id;
        //类型，role或者是user
        const type = this.$route.query && this.$route.query.type;
        if(id&&type){
            this.id=id;
            this.type=type;
            if("role"==type){
                getRole(id).then(res=>{
                    this.objectName = res.data.roleName;
                })
            }
            if("user"==type){
                getUser(id).then(res=>{
                    this.objectName = res.data.nickName;
                })
            }
        }
        this.getList();
    },
    methods: {
        /** 查询文件夹列表 */
        getList() {
            this.loading = true;
            if("role"==this.type){
                listAuthRoleFolder(this.id).then(response => {
                    this.amFolderList = this.handleTree(response.data, "folderId", "parentId");
                    this.loading = false;
                });
            }
            if("user"==this.type){
                listAuthUserFolder(this.id).then(response => {
                    this.amFolderList = this.handleTree(response.data, "folderId", "parentId");
                    this.loading = false;
                });
            }
        },
        /** 转换文件夹数据结构 */
        normalizer(node) {
            if (node.children && !node.children.length) {
                delete node.children;
            }
            return {
                id: node.id,
                label: node.name,
                children: node.children
            };
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.resetForm("queryForm");
            this.handleQuery();
        },
        /** 展开/折叠操作 */
        toggleExpandAll() {
            this.refreshTable = false;
            this.isExpandAll = !this.isExpandAll;
            this.$nextTick(() => {
                this.refreshTable = true;
            });
        },
        // 变更 操作范围
        changeOperateAuth(row){
            let data = {};
            data.id = row.id;
            data.authView = row.authView;
            data.authAdd = row.authAdd;
            data.authUpdate = row.authUpdate;
            data.authDelete = row.authDelete;
            data.folderFileId = row.folderId;
            data.authViewFileInFolder = row.authViewFileInFolder;
            data.range = row.range;
            data.roleId = this.id;
            data.userId = this.id;
            console.log(data)
            if("role"==this.type){
                allotRoleFolder(data).then(res=>{
                    if(200==res.code){
                        this.$modal.msgSuccess("授权成功");
                        this.getList();
                    }
                })
            }
            if("user"==this.type){
                allotUserFolder(data).then(res=>{
                    if(200==res.code){
                        this.$modal.msgSuccess("授权成功");
                        this.getList();
                    }
                })
            }



        },
        // // 变更 数据范围
        // changeRange(row){
        //
        // }
    }
};
</script>
